﻿{% extends "base.html" %}
{% block content %}
    <!-- /主体 -->
    <div id="main-container" class="container clearfix">
        <section class="post-left">
            <div class="breadcrumb">您的位置： <a itemprop="breadcrumb" href="/">首页</a> » <a
                    href="/list-2.html">Python</a> »
                <span class="current">正文</div>
            <div class="post-main clearfix">
                <h1 class="post-title">网站设计-不只是门面漂亮这么简单</h1>
                <div class="post-con clearfix">
                    <div class="article-meta">
                        <span class="item">分类：<a href="/list-2.html" rel="category tag">Python</a></span>
                        <span class="item">作者：admin</span>
                        <span class="item">浏览：43</span>
                        <span class="item">2018年10月7日 17:58</span>

                    </div>
                    <article class="article-content">
                        <p>
                            有人将电子商务网站的视觉设计视为纯粹的美学行为，事实上它还有另外一个很重要的作用，浏览体验。如果运用的好的话，色彩、字体等设计元素能够成功地将访客引导到某一个页面，凸显产品的特征。而较差的浏览体验会分散访客的注意力，进而减少了销售。</p>
                        <p>Josh Levine，网站设计公司Alexander

                            Interactive的创始人兼首席创作体验官，在前不久召开的“网络零售网站设计及可用性大会”上，以“色彩、标题、字体：优秀设计的基础”为题阐述了优秀的设计应该具备的元素并列举了设计实例进行说明。Sari
                            Levine ，Lowe’s
                            Cos公司创意&amp;用户体验负责人分享了Lowe公司的网站从1998年创立伊始只卖单一产品——书——发展到现在吸收有效的视觉设计原理的演化过程。</p>
                        <p>Josh
                            Levine发现，布局、色彩安排、摄影以及艺术学院里学到的其他表现原理，“如果不能充分利用这些设计学院学到的工具，你就可能丢失一部分销售。”他以零售商UnderArmour如何通过红色和黑色传递勇敢和男子气为例说明如何发挥色彩的有效性。他们所要销售的是高档紧身运动服。而同样是红色和黑色主题当被宠物食品网站应用时却会不合时宜。</p>
                        <p><img title="web1" src="static/picture/web1.jpg" alt="" data-tag="bdshare" width="550"
                                height="300"/></p>
                        <p>
                            Levine还分享了如何通过合适的摄影技术增强文本信息来吸引眼球。视线轨迹研究表明，一个婴儿的面部照片比网页上的文字描述更能吸引浏览者的注意，而那种在看文字的婴儿侧脸更容易吸引人们关注文本。他还讨论了网站运营商与设计者之间的紧张状态，运营商希望商品图片和促销活动尽可能填满页面，而设计者则极力反对这种做法，而是“主张空白，抵制零乱”，认为内容过多的页面会造成浏览者的阅读混乱。</p>
                        <p>Sari
                            Levine论述了Lowes.com网站的发展过程，如何应用优秀的设计理念辅助引导使主页更具吸引力。在过去的18个月里，Lowe’s增强了字体的应用，使字体成为连接一个页面关键区域的桥梁，并通过照片和文字结合来让分类页面内容变得清晰。她说，Lowe’s还通过贴心的设计改善了主页的效能，在网站入口处为不同类型的客户提供服务。以此为目的，通过色彩、排版、留白将访客的注意力吸引到页面不同的区域。主页上的不同重点设计——首页以大图显示——以特定的色彩吸引不同的消费者。</p>
                        <p>他们通过不同的字体将顾客引导至所需商品，而不是让顾客自己寻找。Sari
                            Levine补充道，大多数情况下同样的设计原则也可以用来建立有效地移动网站，甚至有些设计在移动网站上的应用效果比电子商务网站的效果更好。当设计移动网站时，要去除所有不必要的信息，否者会导致销售的流失。</p>
                        <p><br/></p>
                    </article>

                    <div class="post-tag"><span class="fa fa-tags" aria-hidden="true"></span>标签：

                        <a href="/tag/Python教程" rel="tag">Python教程</a>

                        <a href="/tag/Django教程" rel="tag">Django教程</a>

                    </div>
                    <div>
                        <div><b>上一篇：</b>

                            <a href="show-2.html" class="article-tag">博客列入12家估值飙升互联网创业企业 Quora第一</a>

                        </div>
                        <div><b>下一篇：</b>

                            <a href="show-8.html" class="article-tag">谷歌用户体验设计准则</a>

                        </div>
                    </div>
                </div>

            </div>
            <!-- /文章 -->


            <div class="recommend  hidden-xs">

                <div class="head clearfix"><span class="sp">您可能感兴趣的:</span></div>
                <ul>

                    <li>
                        <div class="pic">
                            <a href="/show-2.html" title="博客列入12家估值飙升互联网创业企业 Quora第一"><img
                                    src="static/picture/quora.png"
                                    srcset="/media/article_img/2018/10/07/quora.png"
                                    alt="博客列入12家估值飙升互联网创业企业 Quora第一" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-2.html" rel="bookmark"
                           title="博客列入12家估值飙升互联网创业企业 Quora第一">博客列入12家估值飙升互联网创业企业 Quora第一</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-4.html" title="Firefox5新功能:社交共享 集成身份管理"><img
                                    src="static/picture/firefox503.jpg"
                                    srcset="/media/article_img/2018/10/07/firefox503.jpg"
                                    alt="Firefox5新功能:社交共享 集成身份管理" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-4.html" rel="bookmark"
                           title="Firefox5新功能:社交共享 集成身份管理">Firefox5新功能:社交共享 集成身份管理</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-11.html" title="腾讯出品：制定设计的原则"><img
                                    src="static/picture/tx.jpg"
                                    srcset="/media/article_img/2018/10/07/tx.jpg"
                                    alt="腾讯出品：制定设计的原则" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-11.html" rel="bookmark"
                           title="腾讯出品：制定设计的原则">腾讯出品：制定设计的原则</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-9.html" title="社交网络应故意设计得“不够完善”"><img
                                    src="static/picture/shejiaowangluo.jpg"
                                    srcset="/media/article_img/2018/10/07/shejiaowangluo.jpg"
                                    alt="社交网络应故意设计得“不够完善”" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-9.html" rel="bookmark"
                           title="社交网络应故意设计得“不够完善”">社交网络应故意设计得“不够完善”</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-7.html" title="网站设计-不只是门面漂亮这么简单"><img
                                    src="static/picture/web1.jpg"
                                    srcset="/media/article_img/2018/10/07/web1.jpg"
                                    alt="网站设计-不只是门面漂亮这么简单" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-7.html" rel="bookmark"
                           title="网站设计-不只是门面漂亮这么简单">网站设计-不只是门面漂亮这么简单</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-12.html" title="30个别出心裁的WordPress设计"><img
                                    src="static/picture/wpress29.jpg"
                                    srcset="/media/article_img/2018/10/07/wpress29.jpg"
                                    alt="30个别出心裁的WordPress设计" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-12.html" rel="bookmark"
                           title="30个别出心裁的WordPress设计">30个别出心裁的WordPress设计</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-3.html" title="微软发布IE10预览版 或增加IE5浏览模式 提供下载"><img
                                    src="static/picture/ie10-3.jpg"
                                    srcset="/media/article_img/2018/10/07/IE10-3.jpg"
                                    alt="微软发布IE10预览版 或增加IE5浏览模式 提供下载" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-3.html" rel="bookmark"
                           title="微软发布IE10预览版 或增加IE5浏览模式 提供下载">微软发布IE10预览版 或增加IE5浏览模式 提供下载</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-10.html" title="手机端阅读类产品的信息架构"><img
                                    src="static/picture/shouji.jpeg"
                                    srcset="/media/article_img/2018/10/07/shouji.jpeg"
                                    alt="手机端阅读类产品的信息架构" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-10.html" rel="bookmark"
                           title="手机端阅读类产品的信息架构">手机端阅读类产品的信息架构</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-8.html" title="谷歌用户体验设计准则"><img
                                    src="static/picture/tx_3zybskx.jpg"
                                    srcset="/media/article_img/2018/10/07/tx_3zybSKX.jpg"
                                    alt="谷歌用户体验设计准则" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-8.html" rel="bookmark"
                           title="谷歌用户体验设计准则">谷歌用户体验设计准则</a>
                    </li>

                    <li>
                        <div class="pic">
                            <a href="/show-5.html" title="简单HTML5打造内涵搜索框"><img
                                    src="static/picture/web1_if1rrie.jpg"
                                    srcset="/media/article_img/2018/10/07/web1_If1RRie.jpg"
                                    alt="简单HTML5打造内涵搜索框" class="wp-post-image" width="145"
                                    height="100"/></a>
                        </div>
                        <a class="descript " href="/show-5.html" rel="bookmark"
                           title="简单HTML5打造内涵搜索框">简单HTML5打造内涵搜索框</a>
                    </li>

                </ul>
            </div>


        </section>
        <!-- /post-left -->
        <!-- /post-right -->
        <aside class="post-right hidden-xs">
            </section></section>

            {% include 'right.html' %}

        </aside>

        </aside>
    </div>
    <!-- /主体 -->
{% endblock %}